<template>
  <div class="about">
    <van-image src="https://img.yzcdn.cn/vant/cat.jpeg" width="100%" height="300px" fit="cover" />
    <!-- 简单的介绍,使用了vuex的数据 -->
    <van-cell-group>
      <van-cell title="项目名称"><template #default>
          <span>{{ projectName }}</span>
        </template></van-cell>
      <van-cell title="项目简介"><template #default>
          <span>{{ projectAbout }}</span>
        </template></van-cell>
      <van-cell title="项目功能"><template #default>
          <span>{{ projectFun }}</span>
        </template></van-cell>
      <van-cell title="项目技术"><template #default>
          <span>{{ projectTe }}</span>
        </template></van-cell>
      <van-cell title="项目作者"><template #default>
          <span>{{ projectWriter }}</span>
        </template></van-cell>
    </van-cell-group>

  </div>
</template>

<script>
import { mapState } from 'vuex';
export default {
//导入vuex中的数据
  computed: {
    ...mapState(['projectName', 'projectAbout', 'projectFun', 'projectTe', 'projectWriter']),
  },
  name: "IntroPage",
};
</script>

<style scoped>
.intro-page {
  display: flex;
  flex-direction: column;
  align-items: center;
}
</style>
